import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:happy_elf_app/store/config.dart';
import 'package:happy_elf_app/store/user.dart';
import 'package:happy_elf_app/utils/globalKey.dart';
import 'package:happy_elf_app/utils/themColor.dart';
import 'package:happy_elf_app/widgets/headerBack/index.dart';

final UserDataProvider = Provider.of<UserData>(
  Global.navigatorKey.currentContext!,
  listen: false,
);

class Introduction extends StatefulWidget {
  const Introduction({super.key});

  @override
  State<Introduction> createState() => _IntroductionState();
}

class _IntroductionState extends State<Introduction>
    with SingleTickerProviderStateMixin {
  late AnimationController _controller;
  Map userInfo = {};

  @override
  void initState() {
    userInfo = UserDataProvider.userData;
    super.initState();
    _controller = AnimationController(vsync: this);
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      color: hexColor('#ffffff'),
      child: Column(children: [
        HeaderBack(
          title: '实验介绍',
          isFirst: true,
          callback: () {
            Navigator.pop(context);
          },
        ),
        Container(
          padding: EdgeInsets.all(20.0),
          child:
              Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
            // 标题
            const Text(
              '欢迎参与本次研究',
              style: TextStyle(
                fontSize: 18,
                fontWeight: FontWeight.w500,
                color: Colors.black,
              ),
            ),
            const SizedBox(height: 20),
            // 阶段说明
            RichText(
              text: const TextSpan(
                style: TextStyle(fontSize: 16, color: Colors.black),
                children: [
                  TextSpan(
                    text: '本次研究分为2个阶段',
                  ),
                  TextSpan(
                    text: '。',
                    style: TextStyle(),
                  ),
                ],
              ),
            ),
            const SizedBox(height: 10),

            RichText(
              text: TextSpan(
                style: const TextStyle(fontSize: 16, color: Colors.black),
                children: [
                  const TextSpan(
                    text: '第一阶段为期',
                  ),
                  TextSpan(
                    text: '2个月',
                    style: TextStyle(
                      color: hexColor('#e9614d'),
                    ),
                  ),
                  const TextSpan(
                    text: '，实验开始前请阅读必读内容。然后需要您每周',
                    style: TextStyle(),
                  ),
                  TextSpan(
                    text: '至少',
                    style: TextStyle(
                      color: hexColor('#e9614d'),
                    ),
                  ),
                  const TextSpan(
                    text: '使用1次本应用。您需要在2个月',
                    style: TextStyle(),
                  ),
                  const TextSpan(
                    text: '内体验过本应用中',
                    style: TextStyle(),
                  ),
                  TextSpan(
                    text: '完整的核心功能内容',
                    style: TextStyle(
                      color: hexColor('#e9614d'),
                    ),
                  ),
                  const TextSpan(
                    text:
                        '，包括：(1)目标设定; (2)任务创建; (3)任务追踪; (4)情绪记录; (5)精灵进化。此外，您需要每月按时填写微信上发您的问卷。',
                    style: TextStyle(),
                  ),
                ],
              ),
            ),
            const SizedBox(height: 20),

            RichText(
              text: TextSpan(
                style: TextStyle(fontSize: 16, color: Colors.black),
                children: [
                  const TextSpan(
                    text: '第二阶段为期',
                  ),
                  TextSpan(
                    text: '6个月',
                    style: TextStyle(
                      color: hexColor('#e9614d'),
                    ),
                  ),
                  const TextSpan(
                    text: '，您可以自由决定是否使用本产品，以及何时何地使用。同样需要每月按时填写微信上发您的问卷。',
                    style: TextStyle(),
                  ),
                ],
              ),
            ),
            const SizedBox(height: 30),

            // 声明
            RichText(
              text: const TextSpan(
                style: TextStyle(
                  fontSize: 18,
                  fontWeight: FontWeight.w500,
                  color: Colors.black,
                ),
                children: [
                  TextSpan(
                    text: '声明：',
                  ),
                ],
              ),
            ),
            const SizedBox(height: 10),

            RichText(
              text: const TextSpan(
                style: TextStyle(fontSize: 16, color: Colors.black),
                children: [
                  TextSpan(
                    text:
                        '本应用仅收集情绪变化相关的数据，不会储存任何隐私数据。相关数据仅用于学术研究，不会进行公开。一旦您开始使用此应用，代表您已经知情本研究，并同意参与。',
                    style: TextStyle(),
                  ),
                ],
              ),
            ),
            const SizedBox(height: 50),
          ]),
        ),
        if (userInfo['isFirstLogin'])
          SizedBox(
            width: 220,
            child: ElevatedButton(
              style: ElevatedButton.styleFrom(
                backgroundColor: hexColor('#e9614d'),
                padding: const EdgeInsets.symmetric(vertical: 12),
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(28),
                ),
              ),
              onPressed: () {
                // 点击“我同意”后的逻辑，例如跳转到应用主页
                Navigator.pushNamed(context, 'Readme');
              },
              child: const Text(
                '我同意参与本研究',
                style: TextStyle(fontSize: 18, color: Colors.white),
              ),
            ),
          ),
      ]),
    );
  }
}
